<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <link rel="stylesheet" type="text/css"  th:href="@{/css/shop.css}">
  <link rel="stylesheet" type="text/css"  th:href="@{/css/homeHead.css}">
  <link rel="stylesheet" type="text/css"  th:href="@{/css/search.css}">
  <link rel="stylesheet" type="text/css"  th:href="@{/css/type.css}">
</head>
<body>
<div class="head">
  <div class="head-info">
    <div class="head-left">书口浪尖书城</div>
    <div class="head-right">
      <button class="head-btn">借阅</button>
      <a href="/findAllBookInCart" class="head-btn" style="text-decoration:none;">购物车</a>
    </div>
  </div>
</div>
<table>
  <thead>
  <tr>
    <th>书名</th>
    <th>价格</th>
    <th>封面</th>
    <th>操作</th>
  </tr>
  </thead>
  <tbody>
  <!-- 迭代购物车中的物品 -->
  <tr th:each="bookName, status : ${bookNames}">
    <td th:text="${bookName}"></td>
    <td th:text="${bookPrices[__${status.index}__]}"></td>
    <td>
      <img th:src="@{|${bookCovers[__${status.index}__]}|}"
           alt="Book Cover" width="100" height="150" />
    </td>
    <td><form th:action="@{/byBookInCart}" method="post">
      <input type="hidden" name="book_id" th:value="${bookIds[__${status.index}__]}" />
      <button type="submit">购买</button>
    </form> </td>
  </tr>
  </tbody>
</table>
</body>
</html>